<style scoped src="./index.scss" lang="scss" rel="stylesheet/scss"></style>
<template src="./index.html"></template>
<script>
export default {
  mixins: [Vue.prototype.$vFN.Mixins.Base, Vue.prototype.$vFN.Mixins.Edit],
  components: {
    SlideVerify: async () =>
      Vue.extend(await Vue.prototype.$vFN.Components.Base.SlideVerify()),
  },
  data() {
    return {
      appWindow: window,
      form: {
        mobile: "",
        password: "",
        code: "",
      },

      apiUrl: {
        update: "mall-site-portal/portal-login/login/forgetPwd",
      },

      boxVisible: false,

      isLoading: false,

      time: 0,

      imageKey: "",  //验证旋转图片的key
    };
  },

  methods: {
    // 初始化
    async init() { },

    async handleClick() {
      if (!(await this.validate())) {
        return;
      }

      if (this.form.password == this.form.newPassword) {
        this.$vFN.Tools.messageError("新旧密码不能相同");
        return;
      }

      this.isLoading = true;
      let res = await this.$vFN.Http.post(
        {
          isSid: false,
          isToken: false,
          url: this.apiUrl.update,
          data: {
            ...this.form,
          },
        },
        window
      );

      this.isLoading = false;
      if (res._ok) {
        this.$vFN.Tools.messageSuccess(res.message);
        this.boxVisible = false;
        this.onSuccess("success");
      }
    },

    // 获取验证码
    async getCode(rotate_) {
      // 如果正在倒计时
      if (this.time > 0) {
        return;
      }
      // 如果手机号不合法
      if (!this.$vFN.Utils.isPhone(this.form.mobile)) {
        this.$vFN.Tools.messageError("手机号不合法");
        return;
      }

      //   this.mobileBe = this.mobile;
      let _data = await this.$vFN.Http.post(
        {
          isSid: false,
          isToken: false,
          url: "mall-site-portal/portal-login/login/getCode",
          data: {
            mobile: this.form.mobile,
            type: 3,
            imageKey: this.imageKey,
            degree: rotate_
          },
        },
        window
      );


      if (_data._ok) {
        this.countdown(60);
        this.$vFN.Tools.messageSuccess("验证码已发送");
        this.$refs.SlideVerify.hide({
          type: 'success'
        });
      } else {
        this.getVerifyImage("update");
      }

    },

    // 倒计时
    countdown(t_) {
      this.time = t_;
      if (t_ > 0) {
        setTimeout(() => {
          this.countdown(t_ - 1);
        }, 1000);
      }
    },

    // 获取验证码图片
    async getVerifyImage(type) {
      // 如果正在倒计时
      if (this.time > 0) {
        return;
      }
      // 如果手机号不合法
      if (!this.$vFN.Utils.isPhone(this.form.mobile)) {
        this.$vFN.Tools.messageError("手机号不合法");
        return;
      }

      let res = await this.$vFN.Http.post(
        {
          isToken: false,
          isSid: false,
          url: "mall-site-portal/portal-login/login/getImageCode",
          domain: "APP_MAIN_DOMAIN",
        },
        this.appWindow
      );
      if (res._ok) {
        // 验证标识
        this.imageKey = res.data.imageKey;
        // 打开滑动验证码
        this.$refs.SlideVerify[type]({
          // 验证图片
          imageUrl: res.data.imageUri,
          // 回调触发
          change: (res) => {

            this.getCode(res.rotate)

          },
        });
      }
    },

    validate() {
      let that = this;
      return new Promise((resolve, reject) => {
        that.$refs["editForm"].validate((valid) => {
          if (valid) {
            resolve(true);
          } else {
            resolve(false);
          }
        });
      });
    },

    // 成功回调
    onSuccess() { },
    // 取消回调
    onCancel() { },
    // 失败回调
    onError() { },
    // 关闭窗口
    editBoxClose() {
      this.boxVisible = false;
      this.onCancel("cancel");
    },
    // 取消
    editBoxCancel() {
      this.boxVisible = false;
      this.onCancel("cancel");
    },
  },
  mounted() {
    this.boxVisible = true;
    this.init();
  },
  activated() { },
};
</script>
